<@override name="content">
<form class="form-horizontal" id="newTopic" action="discuss/save" method="post">
  <div class="control-group topic <#if titleMsg??>error</#if>">
    <label class="control-label" for="inputTitle">Title</label>
    <div class="controls">
      <textarea id="inputTitle" name="topic.title" rows="1" cols="120" placeholder="Title" required></textarea>
      <p class="text-error">${titleMsg!}</p>
    </div>
  </div>
  <div class="control-group topic <#if problemMsg??>error</#if>">
    <label class="control-label" for="inputProblem">Problem</label>
    <div class="controls">
      <input type="number" id="inputProblem" name="topic.pid" min="1000" placeholder="Problem ID">
      <span class="help-inline" id="problemTitle"></span>
      <p class="text-error">${problemMsg!}</p>
    </div>
  </div>
  <div class="control-group notice">
    <label class="ueditor control-label" for="inputContent">Content</label>
    <div class="controls">
      <textarea id="inputContent" name="topic.content" rows="13" cols="120" required></textarea>
    </div>
  </div>
  <div class="control-group">
    <div class="controls">
      <button type="submit" class="btn btn-primary" id="post">Post</button>
      <button type="reset" class="btn btn-info">Reset</button>
    </div>
  </div>
</form>
</@override>
<@override name="scripts">
  <link href="assets/bootstrap-wysihtml5/bootstrap-wysihtml5-0.0.2.css" rel="stylesheet" type="text/css"></link>
  <script src="assets/bootstrap-wysihtml5/lib/wysihtml5-0.3.0.min.js"></script>  
  <script src="assets/bootstrap-wysihtml5/bootstrap-wysihtml5-0.0.2.min.js"></script>
  <script src="assets/js/ubb.js"></script>
    
  <script type="text/javascript">  
    $('#inputContent').wysihtml5({
      //html: true,
      //color: true
    });
    
    function getProblemTitle() {
      var pid = this.value;
      if (pid >= 1000)
      {
        $.get("api/problem/getField", { name: "title", pid: this.value },
          function(data) {
            if (data.result)
            {
              $("#problemTitle").html('<a href="problem/show/' + pid + '" target="_blank">' + data.result + '</a>');
            }
            else
            {
              $("#problemTitle").html('');
            }
          });
      }
      else
      {
        $("#problemTitle").html('');
      }
    }
    $("#inputProblem").change(getProblemTitle).keyup(getProblemTitle);

    $("#newTopic").submit(function() {
      var $content = $('#inputContent');
      var html = $content.val();
      html = html2ubb(html);
      $content.data("wysihtml5").editor.setValue(html);
      return true;
    });
  </script>
</@override>
<@extends name="../common/_layout.html" />
